<template>
  <div class="my-staff" v-if="isFlag">
    <div class="kad" v-for="(item, index) in list" :key="index" >
      <van-card
        :title="item.names"
        :thumb="item.staffimg"
      >
        <template #tags>
          <van-tag plain type="danger">{{ item.post.toString()}}</van-tag>
          <van-tag plain type="danger">{{ item.skillid.toString() }}</van-tag>
        </template>
        <template #bottom
        >{{ item.location }} | {{ item.age }}岁 | 服务{{ item.serveSum }}户 | 评价{{
            item.evaluateSum }}条</template
        >
        <template #tag>{{ item.salary }}元/2天</template>
      </van-card>
    </div>
  </div>
  <van-loading
    size="50px"
    text-size="25px"
    vertical
    v-else
  >加载中...</van-loading>
</template>

<script>
import { getAuntMessage } from '@/api/homep'
export default {
  name: 'MyStaff',
  data () {
    return {
      list: [],
      isFlag: false
    }
  },
  created () {
    this.myPersonnels()
  },
  mounted () {},
  methods: {
    async myPersonnels () {
      this.isFlag = false
      try {
        const { data: res } = await getAuntMessage({
          follow: true
        })
        console.log(res)
        this.list = res
      } catch (err) {
        console.log(err)
        this.$toast.fail('加载失败')
      }
      this.isFlag = true
    }
    // 点击跳转对应人员详情页
    // getPersonnelId (id) {
    //   this.$router.push(`/home/personnel/${id}`)
    // }
  }
}
</script>

<style scoped lang="less">
.my-staff {
  .kad {
    overflow-x: hidden;
    margin-bottom: 10px;
    background-color: #dcdcdc;
    /deep/ .van-card__thumb img {
      border-radius: 0%;
    }
    .van-card__tag {
      width: 235px;
      left: 460px;
      top: 20px;
      color: #979191;
      padding-left: 70px;
    }
    .van-card__title {
      margin-top: 17px;
      margin-left: 11px;
    }
    .van-tag {
      display: inline-block;
      color: #3f51b5;
      text-align: center;
      width: 160px;
      height: 46px;
      line-height: 46px;
      border-radius: 20px;
      margin-top: 22px;
      margin-right: 16px;
    }
    .van-card__bottom {
      color: #979191;
    }
  }
}
</style>
